<template>
	<view>
		<scroll-view scroll-y class="page">
			  <!-- 头部logo-->
		  <view class="UCenter-bg">
		    <view class="userBox">
				<image :src="personalList.avatar || '/static/head.png'" style="width: 60px;height: 60px;" class="png round animation-slide-right margin-bottom-sm" mode="scaleToFill" :style="[{animationDelay: '0.1s'}]"></image>
				<view class="userNamePost">
					<view class="userName">{{personalList.username || '用户名昵称'}}</view>
					<view class="userPost">{{personalList.post?personalList.post:'操作员'}}</view>
				</view>
			 <!-- <view class="flex flex-sub flex-direction solid-right animation-slide-top" :style="[{animationDelay: '0.2s'}]">
			    <view class="text-xl text-orange">{{personalList.username}}</view>
				 <view class="margin-top-sm"><text class="cuIcon-people"></text> 用户</view>
			  </view>
			  
			  <view class="flex flex-sub flex-direction animation-slide-top" :style="[{animationDelay: '0.2s'}]">
			    <view class="text-xl text-green">{{personalList.post?personalList.post:'员工'}}</view>
			    <view class="margin-top-sm"><text class="cuIcon-news"></text> 职务</view>
			  </view> -->
			</view>
		  </view>
		  <view class="userAction">
			  <view style="width: 100%;height: 100%;overflow: auto;">
				  <template v-if="currentNameCode=='huiyanhe'">
					  <navigator class="cu-item arrow animation-slide-bottom" url="/pages/temp/temp" :style="[{animationDelay: '0.2s'}]">
						  <view class="list"><image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/历史巡检记录.png" mode="aspectFill"></image>
							  设备加解密管理
							  <span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
						  </view>
					  </navigator>
				  </template>
				  
				  <view class="list">
					 <image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/历史巡检记录.png" mode="aspectFill"></image>
					 <span @click="showHis">历史巡检记录</span>
					 <span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
					<view class="listDetail" v-show="hisFlag">
						<superweicombox style="margin-bottom: 12rpx;" class="detailInput" :candidates="deptList" :isJSON="true" keyName="departName" placeholder="部门..."
							@select="select_json"></superweicombox>
						<view class="dateList"  style="margin-top: 12rpx;">
							<view :class="dateIndex0==index?'act dateItem':'dateItem'" v-for="(item,index) in dateList" :key="index" @tap.stop="changeDate0(item,index)">{{item.show}}</view>
						</view>
						<view class="ldItem" v-for="(item,index) in hisList" :key="index">
							<view class="ldiTitle hisLdiTitle">
								<span>{{item.lineName || '无线路'}}</span>
								<span class="taskName">{{item.taskName || '无任务'}}</span>
							</view>
							<view class="hisInfo">
								<view class="hisItem">
									<view class="label">巡检点</view>
									<view class="text">{{item.pointName}}</view>
								</view>
								<view class="hisItem">
									<view class="label">巡检人</view>
									<view class="text">{{getUserByCode(item.createBy).realname}}</view>
								</view>
								<view class="hisItem">
									<view class="label">巡检时间</view>
									<view class="text">{{item.createTime || '--'}}</view>
								</view>
								<view class="hisItem">
									<view class="label">巡检备注</view>
									<view class="text">
										{{item.remark}}
									</view>
								</view>
							</view>
						</view>
					</view>
				  </view>
				  <view class="list" @click="showWorkCard">
					 <image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/历史巡检记录.png" mode="aspectFill"></image>
						今日交接班打卡
					 <span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
					<view class="listDetail" v-show="workCardHisFlag">
						<view class="dateList">
							<view :class="dateIndex==index?'act dateItem':'dateItem'" v-for="(item,index) in dateList" :key="index" @tap.stop="changeDate(item,index)">{{item.show}}</view>
						</view>
						<!-- workCardHisList -->
						<view class="ldItem" v-for="(item,index) in deptList" :key="index">
							<view class="ldiTitle">
								<!-- <span style="color:rgba(51, 51, 51, 1);font-weight: normal;">{{getUserByCode(item.createBy).orgCodeTxt || '--'}}</span> -->
								<span style="color:rgba(51, 51, 51, 1);font-weight: normal;">{{item.departName || '--'}}</span>
								<span v-html="returnDeptCardUser(item).names"></span>
								<span v-html="returnDeptCardUser(item).times" style="color:rgba(51, 51, 51, 1);font-weight: normal;"></span>
							</view>
						</view>
					</view>
				  </view>
				  <navigator class="cu-item arrow animation-slide-bottom" url="/pages/errorListByDept/errorListByDept" :style="[{animationDelay: '0.2s'}]">
					  <view class="list"><image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/历史巡检记录.png" mode="aspectFill"></image>
						  部门问题统计
						  <span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
					  </view>
				  </navigator>
				  <navigator class="cu-item arrow animation-slide-bottom" url="/pages/errorListBySelf/errorListBySelf" :style="[{animationDelay: '0.2s'}]">
					  <view class="list"><image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/历史巡检记录.png" mode="aspectFill"></image>
						  个人发起问题统计
						  <span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
					  </view>
				  </navigator>
				  <navigator class="cu-item arrow animation-slide-bottom" url="/pages/annotation/annotationList" :style="[{animationDelay: '0.2s'}]">
					  <view class="list"><image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/消息管理.png" mode="aspectFill"></image>
						  消息管理
						  <span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
					  </view>
				  </navigator>
				  <navigator class="cu-item arrow animation-slide-bottom" url="/pages/user/userdetail" :style="[{animationDelay: '0.3s'}]">
					<view class="list"><image style="width:20px;height: 20px;margin-right:6px;vertical-align: sub;" src="../../static/个人资料设置.png" mode="aspectFill"></image>
						个人资料设置
						<span style="float:right;font-weight: normal;transform: scaleX(0.6) scaleY(1.2);">></span>
					</view>
				  </navigator>
			  </view>
			  <!-- open-type="redirect" url="/pages/login/login" -->
			  <navigator @click="logoutAct" class="logout animation-slide-bottom"  :style="[{animationDelay: '0.6s'}]">
					退出登录
			  </navigator>
			  
		  </view>
		  <view class="cu-tabbar-height"></view>
		</scroll-view>
	</view>
</template>

<script>
	import { ACCESS_TOKEN,USER_NAME,USER_INFO } from "@/common/util/constants"
	import api from '@/api/api'
	import store from '@/store/index.js';
	import superweicombox from "@/components/superwei-combox/components/superwei-combox/superwei-combox.vue" 
	let dateList = [];
	let nowTime = new Date().getTime() + 86400000;
	for(let i =0;i<7;i++){
		nowTime-=86400000;
		let cYY = new Date(nowTime).getFullYear()
		let cMM = new Date(nowTime).getMonth()+1
		let cDD = new Date(nowTime).getDate();
		cMM=cMM<10?'0'+cMM:cMM;
		cDD=cDD<10?'0'+cDD:cDD;
		dateList.push({
			time:cYY+'-'+cMM+'-'+cDD,
			show:cMM+'-'+cDD
		})
	}
	export default {
		name: "people",
		components:{superweicombox},
		data() {
			return {
				currentNameCode:uni.getStorageSync(USER_INFO).username,
				dateIndex0:0,
				dateIndex:0,
				hisCheckDpetId:'',
				hisCheckDate:dateList[0].time,
				dateList:dateList,//往前推7天
				deptList:[],
				workCardHisFlag:false,
				workCardHisList:[],
				workCards:[],//所有的数据
				hisFlag:false,
				hisList:[],
				errorList:[],
				userList:[],
				personalList:{
				  avatar:'',
				  realname:'',
				  username:'',
				  post:''
				},
				  positionUrl:'/sys/position/list',
				  departUrl:'/sys/user/userDepartList',
				  userUrl:'/sys/user/queryById',
				  postUrl:'/sys/position/queryByCode',
				  userId:'',
				  id:''
			};
		},
		watch: {
			cur: {
				immediate: true,
				handler() {
					console.log('watch',this.cur)
				    this.userId=this.$store.getters.userid;
					this.load()
				},
			},
		},
		mounted() {
			this.getUserList();
			// 获取部门
			this.getDepts();
		},
		methods: {
			// 选中回调
			select_json(e) {
				console.log('json下拉',e) // {id: '1',name: '选项一'}
				this.hisCheckDpetId = e.id;
				this.getHis();
				// console.log(this.userText);
				// this.allData[this.currentIdKey].status = e.id
			},
			// 日期不对,待调整
			returnDeptCardUser(dept){
				let res= this.workCardHisList.filter(item=>{
					return this.getUserByCode(item.createBy).orgCodeTxt == dept.departName
				})
				if(res && res.length){
					return {
						names:res.map(item=>{
							return this.getUserByCode(item.createBy).realname
						}).join('<br/>'),
						times:res.map(item=>{
							return item.createTime
						}).join('<br/>')
					}
				}else{
					return {
						names:'',
						times:''
					}
				}
			},
			getDepts(){
				this.$http.get('/sys/sysDepart/queryTreeList').then(res=>{
					this.deptList = res.data.result;
					console.log('部门',this.deptList)
				})
			},
			getUserByCode(code){
				let obj={};
				this.userList.map(item=>{
					if(item.username == code){
						obj=item
					}
				})
				return obj
			},
			getUserList(){
				let _this = this;
				this.$http.get('/sys/user/list?pageNo=1&pageSize=9999').then((res)=>{
					_this.userList = res.data.result.records;
				})
			},
			showError(){
				let _this = this;
				this.workCardHisFlag = !this.workCardHisFlag;
				this.$http.get('/inspect/insClassesUnusualMsg/list?createBy='+ uni.getStorageSync(USER_INFO).username +'&column=createTime&order=desc&field=id,,unusualName,unusualContent,taskId_dictText,pointId_dictText,status_dictText,remark,action&pageNo=1&pageSize=50')
					.then(res=>{
						_this.errorList = res.data.result.records
					})
			},
			showWorkCard(){
				console.log('打开历史1：',this.workCardHisFlag)
				this.dateIndex = 0;
				let _this = this;
				this.workCardHisFlag = !this.workCardHisFlag;
				this.$http.get('/inspect/insTaskRecord/listConnect?pageNo=1&pageSize=9999').then(res=>{
					let full = new Date();
					let YYYY = full.getFullYear();
					let MM = parseInt(full.getMonth())+1<10?'0'+(parseInt(full.getMonth())+1):parseInt(full.getMonth())+1;
					let DD = Number(full.getDate()) < 10 ? '0'+Number(full.getDate()):Number(full.getDate());
					let start = (new Date(YYYY+'-'+MM+'-'+DD+' 00:00:00')).getTime();
					let end = (new Date(YYYY+'-'+MM+'-'+DD+' 23:59:59')).getTime();
					if(res.data.success){
						_this.workCards=res.data.result.records;
						_this.workCardHisList = res.data.result.records.filter(item=>{
							return new Date(item.createTime).getTime() >=start && new Date(item.createTime).getTime() <= end
						})
					}
					console.log(res.result)
				})
			},
			changeDate0(item,index){
				this.dateIndex0 = index;
				this.hisCheckDate = item.time;
				this.getHis();
			},
			changeDate(item,index){
				this.dateIndex = index;
				let res = this.workCards.filter(ii=>{
					return new Date(ii.createTime).getTime() >= (new Date(item.time + ' 00:00:00')).getTime() 
					&& new Date(ii.createTime).getTime() <= (new Date(item.time + ' 23:59:59')).getTime() 
				});
				this.$set(this,'workCardHisList',res);
				console.log(res);
			},
			getHis(){
				let subObj='';
				let _this = this;
				// let times = new Date(this.hisCheckDate +' 00:00:00').getTime();
				this.$http.get('/inspect/insTaskRecord/mList?pageNo=1&pageSize=50&deptId='+this.hisCheckDpetId+'&insTime_begin='+this.hisCheckDate).then(res=>{
					console.log(res)
					if(res.data.success){
						_this.hisList = res.data.result.records.filter(item=>{
							return !item.isConnect
						})
					}
				})
			},
			showHis(){
				console.log('打开历史：',this.hisFlag)
				let _this = this;
				this.hisFlag = !this.hisFlag;
				if(this.hisFlag){
					this.getHis();
				}
			},
			scan(){
				 console.log("进来了")
				// #ifndef H5
				uni.scanCode({
				    success: function (res) {
						console.log('条码res：' + res);
				        console.log('条码类型：' + res.scanType);
				        console.log('条码内容：' + res.result);
				    }
				});
				// #endif
				// #ifdef H5
				this.$tip.alert("暂不支持")
				// #endif
			},
			load(){
				if(!this.userId){
					
					return;
				}
				this.$http.get(this.userUrl,{params:{id:uni.getStorageSync(USER_INFO).id}}).then(res=>{
					console.log("res",res)
					 if (res.data.success) {
						let perArr = res.data.result
				        let avatar=(perArr.avatar && perArr.avatar.length > 0)? api.getFileAccessHttpUrl(perArr.avatar):'/static/head.png'
						this.personalList.avatar =avatar
						this.personalList.realname = perArr.realname
						this.personalList.username = perArr.username
						this.personalList.depart = perArr.departIds
						this.personalList.post = perArr.post
					    this.getpost(perArr.post)
					}
				}).catch(err => {
					console.log(err);
				});
				
			},
			
			// 登出
			logoutAct() {
				let _this = this;
				 store.dispatch('Logout').then(() => {
					_this.$Router.replace({name:'login'})
				 }) 
			},
			getpost(code){
				if(!code||code.length==0){
					this.personalList.post='员工'
					return false;
				}
				this.$http.get(this.postUrl,{params:{code:code}}).then(res=>{
					console.log("postUrl",res)
					 if (res.data.success) {
						this.personalList.post=res.data.result.name
					}
				}).catch(err => {
					console.log(err);
				});
				
			}
		}
	}
</script>

<style scoped>
	.userBox{
		width: 100%;
		position: absolute;
		right: 0;
		bottom: 56rpx;
		left: 16px;
		display: flex;
	}
	.userAction{
		height: calc(100% - 300rpx);
		position: relative;
		margin-top: -30px;
		background-color: rgba(245, 247, 249, 1);
		padding-bottom: 52px;
		overflow: auto;
		padding-top: 20px;
	}
	.list{
		line-height: 104rpx;
		line-height: 104rpx;
		font-size: 15px;
		font-weight: bold;
		color: rgba(51, 51, 51, 1);
		background-color: #fff;
		border-radius: 16rpx;
		padding:0 12px;
		margin:0 20rpx 20rpx 20rpx;
	}
	.list image{
		filter: grayscale(1);
	}
	.listDetail{
		padding-bottom:6px;
	}
	.logout{
		width: calc(100% - 24px);
		margin: auto;
		position: absolute;
		bottom: 12px;
		left: 12px;
		margin-top: 30px;
		border-radius: 6px;
		background-color: transparent;
		height: 72rpx;
		line-height: 72rpx;
		text-align: center;
		font-size: 15px;
		color: rgba(83, 100, 126, 1);
	}
	.ldiTitle{
		min-height: 92rpx;
		line-height: 92rpx;
		font-weight: bold;
		font-size: 28rpx;
		display: flex;
		justify-content: space-between;
		color: rgba(20, 203, 159, 1);
		padding: 0 12px;
		border-bottom: 1px solid rgba(234, 234, 234, 1);
		align-items: center;
	}
	.hisLdiTitle{
		min-height: 92rpx;
		height: auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		line-height: 32rpx;
	}
	.hisLdiTitle .taskName{
		min-height: 44rpx;
		height: auto;
		margin: 8rpx 0;
	}
	.hisInfo{
		font-size: 11px;
		line-height: 18px;
		padding: 6px 0;
	}
	.taskName{
		line-height: 20px;
		background-color: rgba(55, 135, 255, 0.10);
		color:rgba(55, 135, 255, 1);
		padding: 0 8px;
		font-size: 11px;
		font-weight: normal;
		height: 22px;
		border-radius: 2px;
	}
	.hisItem{
		display: flex;
		padding-left: 12px;
		font-weight: normal;
	}
	.hisItem .label{
		width: 52px;
		color: rgba(153, 153, 153, 1);
	}
	.hisItem .text{
		width: calc(100% - 62px);
	}
	.ldItem{
		background-color: rgba(249, 255, 255, 1);
		border: 1px solid rgba(20, 203, 159, 1);
		border-radius: 8px;
		margin-top: 12px;
	}
.UCenter-bg {
	background:rgba(245, 247, 249, 1);
  height: 280rpx;
  display: flex;
  justify-content: center;
  padding-top: 40rpx;
  overflow: hidden;
  position: relative;
  flex-direction: column;
  align-items: center;
  color: rgba(51, 51, 51, 1);
  font-weight: 300;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}

.UCenter-bg text {
  opacity: 0.8;
}
.userNamePost{
	height: 60px;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	margin-left: 10px;
}
.userName{
	font-weight: bold;
	font-size: 15px;
	line-height: 18px;
	color: rgba(51, 51, 51, 1);
}
.userPost{
	background-color: transparent;
	width: 45px;
	height: 20px;
	line-height: 20px;
	border-radius: 4px;
	color: rgba(55, 135, 255, 1);
	text-align: center;
	border: 2rpx solid rgba(55, 135, 255, 1);
}
.UCenter-bg image {
  width: 200rpx;
  height: 200rpx;
  border-radius: 200rpx;
  box-shadow: 0px 0px 20rpx rgba(51,51,51,.2);
}

.UCenter-bg .gif-wave{
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 99;
  mix-blend-mode: screen;  
  height: 100rpx;   
}

map,.mapBox{
  left: 0;
  z-index: 99;
  mix-blend-mode: screen;  
  height: 100rpx;   
}

map,.mapBox{
  width: 750rpx;
  height: 300rpx;
}
.page{
	width: 100%;
	height:100vh;
	overflow: hidden;
	background-color: RGBA(245, 247, 249, 1);
}
.dateList{
	display: flex;
	gap:20rpx;
	flex-wrap: wrap;
	font-size: 28rpx;
}
.dateItem{
	display: inline-block;
	line-height: 56rpx;
	padding: 0 20rpx;
	border-radius: 8rpx;
}
.dateItem.act{
	background-color: #13CA9C;
	color: #fff;
}
/deep/ .superwei-combox__input,/deep/ .superwei-combox__selector text{
	font-weight: normal;
}
</style>
